<template>
  <div class="main">
    <StationHead :address="address" :time="delivery_time" @showTimesele="handleShowTimeSelect"/>
    <StationLists :lists="lists" @handleSelect="handleSeleStation"/>
    <StationFoot @handleSubmit="handleSubmit" @handleReturn="handleReturn"/>

    <van-popup v-model="showTimePopup" position="bottom">
      <van-datetime-picker
        v-model="currentDate"
        type="datetime"
        :min-date="minDate"
        @confirm="handleConfirm"
        @cancel="handleCancel"
      />
    </van-popup>
  </div>
</template>

<script>
import api from "../../api";
import common from "../../api/common";
import StationHead from "@/components/station/StationHead";
import StationLists from "@/components/station/StationLists";
import StationFoot from "@/components/station/StationFoot";
import { transferTime } from "../../tools/time";
export default {
  title: "选择水站",
  components: {
    StationHead,
    StationLists,
    StationFoot
  },
  data() {
    return {
      showTimePopup: false,
      minDate: new Date(),
      currentDate: new Date(),
      address: {},
      lists: [],
      uid: this.$store.state.uid,
      address_id: common.getParam("addressId"),
      product_id: common.getParam("productId"),
      number: common.getParam("number"),
      delivery_time: "",
      zhan_id: ""
    };
  },
  methods: {
    handleReturn() {
      if (!this.zhan_id) {
        this.$toast(`请选择水站`);
        return;
      }
      api.order.returnBucket(this.uid, this.zhan_id, this.address_id, res => {
        this.$routerPush(this, `/pages/handback/Waiting`);
      });
    },
    handleSubmit() {
      let that = this;
      if (!this.delivery_time) {
        this.$toast(`请选择配送时间`);
        return;
      }
      if (!this.zhan_id) {
        this.$toast(`请选择水站`);
        return;
      }

      this.$dialog
        .confirm({
          title: `提示`,
          message: "是否确认下单？"
        })
        .then(() => {
          api.order.useTicket(
            this.address_id,
            this.uid,
            this.product_id,
            this.delivery_time,
            this.zhan_id,
            this.number,
            res => {
              this.$toast.success({
                message: `下单成功`,
                icon: "success",
                duration: 2000,
                onClose() {
                  that.$routerPush(this, `/pages/station/Success`);
                }
              });
            }
          );
        })
        .catch(() => {
          console.log("关闭");
        });
    },
    handleShowTimeSelect() {
      this.showTimePopup = true;
    },
    getStationList() {
      api.usercenter.getStationList(this.address_id, res => {
        console.log(res);
        this.lists = res;
      });
    },
    getAddressDetail() {
      api.address.getAddressDetail(this.uid, this.address_id, res => {
        this.address = res;
      });
    },
    handleConfirm(v) {
      this.delivery_time = transferTime(v);
      console.log(this.delivery_time);
      this.showTimePopup = false;
    },
    handleCancel() {
      this.showTimePopup = false;
    },
    handleSeleStation(v) {
      this.zhan_id = v;
    }
  },
  mounted() {
    this.getStationList();
    this.getAddressDetail();
  }
};
</script>

<style lang="less" scoped>
</style>